import React, { Component } from 'react'
import {LeftOutlined,EllipsisOutlined,AppstoreAddOutlined, CommentOutlined,DislikeOutlined,PictureOutlined} from '@ant-design/icons'
import img1 from "../image/images/1_03.png"
import {Tabs} from "antd"
import {Link} from "react-router-dom"
import "./Person.css"
const { TabPane } = Tabs;
function callback(key) {
    // console.log(key);
    }

    const Demo = () => {
        return(
        <Tabs defaultActiveKey="1" onChange={callback}>
        <TabPane tab="动态" key="1">
                               <div className="fir">
                                    
                                    <div className="tan">
                                        <img src={img1}/>
                                        <div className="div">
                                            <p className="p1">辰辰403200</p>
                                            <p className="p2">3月26日</p>

                                        </div>
                                    </div>
                                  
                                        <p className="wo">
                                            我是nice新成员，我们一起来玩耍吧！
                                        </p>
                                 
                                    <div className="tu">
                                        
                                        <img src={img1}/>
                                       
                                        <div className="di">
                                            <EllipsisOutlined />
                                            <Link to="/follow">
                                                 <div className="right" >
                                                    <CommentOutlined style={{color:"gray"}}/>
                                                    <DislikeOutlined style={{color:"gray"}}/>
                                                </div>
                                            </Link>
                                        </div>
                                        
                                    </div>
                               </div>
                            </TabPane>
                            <TabPane tab="相册" key="2">
                                    <div className="second">
                                       <Link to="/follow">
                                            <div>
                                                <img src={img1} />
                                            </div>
                                       </Link>
                                        <Link to="/follow">
                                            <div className="follow">
                                                <PictureOutlined style={{width: "28px" ,height: "18px",marginTop:"30px"}}/>
                                                <span style={{marginTop:"-30px"}}>点击分享图片</span>
                                            </div>
                                        </Link>
                                    </div>
                            </TabPane>
                           
                        </Tabs>
      
                      
        )}
 class Person extends Component {
   
    render() {
       
        return (
            <div className="person">
                <nav>
                    <div className="first">
                        <Link to="../Mine">
                            <LeftOutlined style={{color:"#111"}}/> 
                        </Link>
                       <div className="fi">
                            <Link to="./qrcode">
                                 <AppstoreAddOutlined style={{color:"#111"}}/>

                            </Link>                                
                           
                            
                            <Link to="./share">
                                <EllipsisOutlined style={{color:"#111"}}/>
                            </Link>
                            
                       </div>
                    </div>
                    <div className="sec">
                        <img src={img1}/>
                        <button className="button1">
                            <Link to="./edit" style={{color:"#111"}}>编辑资料</Link>
                        </button>
                    </div>
                    <div className="third">
                        <p className="p1">辰辰403200</p>
                        <p className="p2"><span className="nan">男</span><span className="di">辽宁沈阳</span></p>
                        <p className="p3">
                            <span>
                                <Link to="./follow" style={{color:"#111"}} className="bt1"><span className="wenzi">0</span>关注</Link>
                            </span>
                            <span className="bt2">
                              <span className="fensi">0</span>粉丝
                            </span>
                            

                        </p>

                    </div>
                </nav>
                <Demo />     
            </div>
        )
    }
}
export default Person